<style>
.box-bestseller{/*width:220px;*/ border:1px solid #53abe0; height:auto; overflow:hidden; margin-top:10px; }
ul, li{margin: 0;
	padding: 0;
	border: 0;}
.img_bs{width:75px; float:left; padding-left:5px;}
.info_bs{overflow: hidden; float:right; width:130px;}
.deal_content{margin-top:10px; margin-bottom:10px; height:50px; width:215px;}
.deal_content .name {
    color: #4f9f2c;
    overflow: hidden;
	font-size:11.4px;
}
.deal_content .name span {
    font-size: 18px;
}
.deal_content .info_bs .price_sale {
    color: #48a7e9;
    font-size: 14px; font-weight:bold;}
.deal_content .info_bs .xemnhanh-icon {
float:right;background:url(../bg-nutn.png) no-repeat;width:44px;height:22px;margin-top:-3px;
}
li.selected {  height:28px; padding-top:4px; padding-left:10px; background:url(../images/bg-act.png) no-repeat;}
li.selected a{color:#FFF; font-size:15px;font-weight:bold;}
li.unselected {  height:24px; padding-top:4px; padding-left:10px; background:url(../images/bg-unact.png) no-repeat;}
li.unselected a{color:#FFF; font-size:15px;font-weight:bold;}
.box-danhmuc{width:220px; border:1px solid #8be053; height:auto; overflow:hidden; }
.box-danhmuc .title{ color:#FFF; font-size:15px; height:26px; padding-top:4px; padding-left:10px; background:#8be053; font-weight:bold;}
.box-danhmuc ul li{padding-left:15px; padding-top:10px; padding-right:15px;}
.box-danhmuc ul li.dm_unselected a{color:#727171; font-weight:normal; }
.box-danhmuc ul li.dm_selected a{color:#6cc332; font-weight:bold; }
.box-danhmuc ul li a span{ float:right;}
.clear{clear:both;}
.xemnhanh-icon .tuan3{background:url(images/trangchu-icons2.png) no-repeat; background-position:0px -23px;width:40px;height:19px;margin:2px 0px 0px 8px;padding:0px;}
.xemnhanh-icon:hover .tuan3{background:url(images/trangchu-icons2.png) no-repeat; background-position:0px 0px;}


</style>
<div class="box-danhmuc">
	<div class="title">
    	Danh mục sản phẩm
    </div>
    <ul class="nav-danhmuc">
    	<li class="dm_selected"><a href="#">Ăn uống <span>(5)</span></a></li>
        <li class="dm_unselected"><a href="#">Sức khỏe <span>(4)</span></a></li>
        <li class="dm_unselected"><a href="#">Làm đẹp <span>(33)</span></a></li>
    </ul>
</div>	
	<div class="clear"></div>
<div>
<ul class="boxbanchay">
	<div class="box-bestseller">
    <li style="margin:0px;" class="selected">
        <a id="myHeader1" href="javascript:slideonlyone('newboxes1');" >
        Bán chạy nhất       
        </a></li>
        <div class="newboxes2" id="newboxes1" >
            <div class="deal_content">
            <div class="img_bs">
                <img src="../images/img-banchay.png" alt="" width="76" height="44" />
            </div>
            <div class="info_bs">
                <div class="name" title="">
                    <a>Tên sản phẩm dịch vụ Tên sản phẩm </a>            
                </div>
                <div class="price">
                    <span class="price_sale">65.000đ&nbsp;</span>
                    <span class="xemnhanh-icon"><a href=""><p class="tuan3"></p></a></span>
                </div>                        
            </div>
        </div>
            <div class="deal_content">
            <div class="img_bs">
                <img src="../images/img-banchay.png" alt="" width="76" height="44" />
            </div>
            <div class="info_bs">
                <div class="name" title="">
                    <a>Tên sản phẩm dịch vụ Tên sản phẩm </a>            
                </div>
                <div class="price">
                    <span class="price_sale">65.000đ&nbsp;</span>
                    <span class="xemnhanh-icon"><a href=""><p class="tuan3"></p></a></span>
                </div>                        
            </div>
        </div>
        </div>
    </div>
    <div class="box-bestseller" >
    <li class="unselected">
        <a id="myHeader2" href="javascript:slideonlyone('newboxes2');" >
            Hot nhat
        </a></li>
        <div class="newboxes2" id="newboxes2" style="display:none;">
            <div class="deal_content">
            <div class="img_bs">
                <img src="../images/img-banchay.png" alt="" width="76" height="44" />
            </div>
            <div class="info_bs">
                <div class="name" title="">
                    <a>Tên sản phẩm dịch vụ Tên sản phẩm</a>            
                </div>
                <div class="price">
                    <span class="price_sale">65.000đ&nbsp;</span>
                    <span class="xemnhanh-icon"><a href=""><p class="tuan3"></p></a></span>
                </div>                        
            </div>
        </div>
        </div>
    </div>
    <div class="box-bestseller" >
    <li class="unselected">
        <a id="myHeader2" href="javascript:slideonlyone('newboxes3');" >
            Hot nhat
       </a></li>
        <div class="newboxes2" id="newboxes3" style="display:none;">
            <div class="deal_content">
            <div class="img_bs">
                <img src="../images/img-banchay.png" alt="" width="76" height="44" />
            </div>
            <div class="info_bs">
                <div class="name" title="">
                    <a>Tên sản phẩm dịch vụ Tên sản phẩm</a>            
                </div>
                <div class="price">
                    <span class="price_sale">65.000đ&nbsp;</span>
                   <span class="xemnhanh-icon"><a href=""><p class="tuan3"></p></a></span>
                </div>                        
            </div>
        </div>
        </div>
    </div>
    <div class="box-bestseller" >
    <li class="unselected">
        <a id="myHeader2" href="javascript:slideonlyone('newboxes4');" >
            Hot nhat
        </a></li>
        <div class="newboxes2" id="newboxes4" style="display:none;">
            <div class="deal_content">
            <div class="img_bs">
                <img src="../images/img-banchay.png" alt="" width="76" height="44" />
            </div>
            <div class="info_bs">
                <div class="name" title="">
                    <a>Tên sản phẩm dịch vụ Tên sản phẩm</a>            
                </div>
                <div class="price">
                    <span class="price_sale">65.000đ&nbsp;</span>
                    <span class="xemnhanh-icon"><a href=""><p class="tuan3"></p></a></span>
                </div>                        
            </div>
        </div>
        </div>
    </div>
</ul></div>
<script>
function slideonlyone(thechosenone) {
     $j('.newboxes2').each(function(index) {
          if ($j(this).attr("id") == thechosenone) {
               $j(this).slideDown(200);
          }
          else {
               $j(this).slideUp(600);
          }
     });
}
</script>
<script>
$j(document).ready(function(){
$j(".boxbanchay a").click(function () {
	$j(".selected").removeClass("selected").addClass('unselected');
	$j(this).parent().addClass("selected").removeClass('unselected');
});
});
</script>
<script>
$j(document).ready(function(){
$j(".box-danhmuc a").click(function () {
	$j(".dm_selected").removeClass("dm_selected").addClass('dm_unselected');
	$j(this).parent().addClass("dm_selected").removeClass('dm_unselected');
});
});
</script>
